<script setup lang="ts">
import { ref, watch } from 'vue';

//
const model = defineModel()
const props = defineProps(["options"])

let dataValue = ref<any>()
watch(() => dataValue.value, (newVal, oldVal) => {
  console.log(newVal, oldVal)
  if (!newVal){
    model.value = null;
  }else {
    model.value = [newVal]
  }
  
})

</script>

<template>
  <el-input v-if="options.type === 1" v-model="dataValue" type="number" :placeholder="options.label" clearable />
  <el-input v-else-if="options.type === 2" v-model="dataValue" :placeholder="options.label" clearable/>
  <el-date-picker style="width: 100%;" v-else-if="options.type === 3"
                  v-model="model" type="datetimerange" :start-placeholder="options.label"
                  :end-placeholder="options.label"
                  value-format="YYYY-MM-DD HH:mm:ss"
                  format="YYYY-MM-DD HH:mm:ss" :placeholder="options.label" clearable/>
  <el-select v-else-if="options.type === 4" v-model="dataValue" :placeholder="options.label" clearable>
    <el-option :value="1" label="是"/>
    <el-option :value="2" label="否"/>
  </el-select>
</template>

<style scoped>

</style>